/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 * @flow
 */

import React from 'react';
import {Button, Image, Text, View, FlatList,StyleSheet} from 'react-native';
import Styles from './Styles';
import Item_Circle from '../../components/Item_Circle';

let i = 1;
export default class Page3 extends BaseComponent {

    static navigationOptions = {
        headerTitle: '消息',//对页面的配置
        tabBarLabel: '消息',
        tabBarIcon: ({focused}) => {
            if (focused) {
                return (
                    <Image style={Styles.tabBarIcon} source={require('../../images/message_fill.png')}/>
                );
            }
            return (
                <Image style={Styles.tabBarIcon} source={require('../../images/message.png')}/>
            );
        },
    };

    // 构造
    constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            result: '空',
            data:[
                [{url:'',name:'第一'},{url:'',name:'第二'}],
                [{url:'',name:'第三'},{url:'',name:'第四'}],
                [{url:'',name:'第五'},{url:'',name:'第六'}],
                [{url:'',name:'第七'},{url:'',name:'第八'}],
                [{url:'',name:'第九'},{url:'',name:'第十'}],
                [{url:'',name:'第十一'},{url:'',name:'第十二'}],
                [{url:'',name:'第十三'},{url:'',name:'第十四'}],
                [{url:'',name:'第十五'},{url:'',name:'第十六'}],
                [{url:'',name:'第十七'},{url:'',name:'第十八'}],
                [{url:'',name:'第十九'},]
            ],
        };
    }

    initStorage() {
        return (
            <View style={{flex: 1, flexDirection: 'column', justifyContent: 'center', alignItems: 'center'}}>
                {/*<Animation_2>
                    <Text>我是一段文字内容</Text>
                </Animation_2>*/}
                <Text>{this.state.result}</Text>
                <Button
                    onPress={() => {
                        StorageUtil._saveData('key' + i, '我是一个值' + i);
                        i++;
                    }}
                    title={'保存数据'}/>
                <Button
                    onPress={() => {
                        StorageUtil._readData('key1').then((msg) => {
                            ShowToast("结果：" + msg);
                            this.setState({
                                result: msg,
                            })
                        }).catch((error) => {
                            ShowToast(error);
                        });
                    }}
                    title={'读取数据'}/>
                <Button
                    onPress={() => {
                        StorageUtil._deleteData('key1');
                    }}
                    title={'删除数据'}/>
                <Button
                    onPress={() => {
                        StorageUtil._getAllKey().then((array) => {
                            ShowToast("结果：" + array);
                        }).catch((error) => {
                            ShowToast(error);
                        });
                    }}
                    title={'所有Key'}/>
                <Button
                    onPress={() => {
                        StorageUtil._multiGet(['key1', 'key2']).then((map) => {
                            ShowToast("结果：" + JsonUtil.mapToJson(map));
                        }).catch((error) => {
                            ShowToast(error);
                        });
                    }}
                    title={'数组Key'}/>
            </View>
        );
    }

    initCircleItem(itemData){
        return(
            <Item_Circle data={itemData.item} onClick={(msg)=>{alert(msg)}}/>
        )
    }

    render() {
        return (
            <View style={{flex: 1}}>

                {/*<FlatList
                    renderItem={this.initCircleItem.bind(this)}
                    data={this.state.data}
                    horizontal={true}
                    showsHorizontalScrollIndicator={false}
                />*/}

                {this.initStorage()}

            </View>

        );
    }
}
